
<!doctype html>
<!--[if lt IE 7 ]><html lang="en" class="no-js ie6"> <![endif]-->
<!--[if IE 7 ]><html lang="en" class="no-js ie7"> <![endif]-->
<!--[if IE 8 ]><html lang="en" class="no-js ie8"> <![endif]-->
<!--[if IE 9 ]><html lang="en" class="no-js ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en" class="no-js"> <!--<![endif]--> 
<head>
<meta charset="utf-8">
<meta name="author" content="ThemeFuse">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Metro Vibes | Blog</title>

<!-- main JS libs  -->
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/libs/modernizr.min.js"></script>
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/libs/jquery-1.10.0.js"></script>
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/libs/jquery-ui.min.js"></script>
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/libs/bootstrap.min.js"></script>

<!-- Style CSS-->
<link href="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/css/bootstrap.css" media="screen" rel="stylesheet">
<link href="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/style.css" media="screen" rel="stylesheet">

<!-- scripts  -->
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/general.js"></script>
<!-- custom input -->
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/jquery.customInput.js"></script>
<script type="text/javascript" src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/custom.js"></script>
<!-- Placeholders -->
<script type="text/javascript" src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/jquery.powerful-placeholder.min.js"></script>
<!-- Calendar -->
<link href="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/css/jquery-ui-1.8.20.custom.css" rel="stylesheet">
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/jquery-ui.multidatespicker.js"></script>
<!-- Video Player  -->
<link href="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/css/video-js.css" rel="stylesheet">
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/video.js"></script>
<!-- Audio Player  -->
<link href="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/css/jplayer.css" rel="stylesheet">
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/jquery.jplayer.min.js"></script>
<script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/jplayer.playlist.min.js"></script>
<script type="text/javascript">
	//<![CDATA[
	$(document).ready(function(){

		new jPlayerPlaylist({
			jPlayer: "#jquery_jplayer_1",
			cssSelectorAncestor: "#jp_container_1"
		}, [
			{
				title:"<div class='item-song'>He lives in you, he lives in me</div><div class='item-artist'>Elton John, Hans Zimmer</div><img src='images/temp/music-player1.jpg' alt='' />",
                mp3:"http://www.jplayer.org/audio/mp3/TSP-05-Your_face.mp3",
                oga:"http://www.jplayer.org/audio/ogg/TSP-05-Your_face.ogg"
			},
			{
				title:"<div class='item-song'>I saw you dancing</div><div class='item-artist'>Yaki Da</div><img src='images/temp/music-player2.jpg' alt='' />",
                mp3:"http://www.jplayer.org/audio/mp3/TSP-07-Cybersonnet.mp3",
                oga:"http://www.jplayer.org/audio/ogg/TSP-07-Cybersonnet.ogg"
			},
			{
				title:"<div class='item-song'>Sands of Time</div><div class='item-artist'>Pandora</div><img src='images/temp/music-player3.jpg' alt='' />",
                mp3:"http://www.jplayer.org/audio/mp3/Miaow-07-Bubble.mp3",
                oga:"http://www.jplayer.org/audio/ogg/Miaow-07-Bubble.ogg"
			}
		], {
			swfPath: "js",
			supplied: "oga, mp3",
			wmode: "window",
			smoothPlayBar: false,
			keyEnabled: false
		});
	});
	//]]>
</script>

<!--[if lt IE 9]><script src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/js/respond.min.js"></script><![endif]-->
<!--[if gte IE 9]>
<style type="text/css">
    .gradient {filter: none !important;}
</style>
<![endif]-->
</head>

<body>
	<div class="container">

		<!-- row-->
		<div class="row">
			<div class="col-sm-8">
				<!-- content-->
				<div class="content " role="main">

					<!-- post list -->
					<div class="postlist">

						<!-- post item-->
						<div class="post-item boxed">
                            <div class="post-meta-top">
                                <div class="ribbon"><span><em class="post-date">21</em><strong class="post-author">feb</strong></span></div>
                            </div>
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img1.jpg" alt=""></div>
                            <div class="inner">
                                <div class="post-title"><h2><a href="#">New icon pack released!</a></h2></div>
                                <div class="post-desc">
                                    <p>Wisi denique pri ut, ex detraxit torquatos usu. Per admodum concludaturque te, putant melius aliquam pri in. Id sit case consul contentiones, sea illud postea praesent et. Vix te labore indoctum iudicabit. Ne aliquid facilisis mel. Ut nam duis recteque, nemore everti mel</p>
                                </div>
                            </div>
                            <div class="post-meta-bot post-meta-links">
                                <ul class="clearfix">
                                    <li class="post-meta post-view"><a href="#"><span><i class="icon-post"></i>172</span></a></li>
                                    <li class="post-meta post-comm"><a href="#"><span><i class="icon-post"></i>34</span></a></li>
                                    <li class="post-meta post-author"><a href="#"><span><i class="icon-post"></i>John Doe</span></a></li>
                                    <li class="post-meta post-read"><a href="#"><i class="icon-post"></i><span>Read More</span></a></li>
                                </ul>
                            </div>
						</div>
						<!--/post item-->

						<!-- post item-->
						<div class="post-item boxed style2">
							<div class="inner">
                                <div class="post-title"><h2><a href="#">Target health & beauty personal care shaving and  grooming Braun Series 7-760cc</a></h2></div>
                                <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img2.jpg" alt=""></div>
								<div class="post-meta-top"></div>
								<div class="post-desc">
									<p>Wisi denique pri ut, ex detraxit torquatos usu. Per admodum concludaturque te, putant melius aliquam pri in. Id sit case consul contentiones, sea illud postea praesent et. Vix te labore indoctum iudicabit. Ne aliquid facilisis mel. Ut nam duis recteque, nemore everti</p>
								</div>
								<div class="post-meta-bot post-meta-links">
                                    <ul class="clearfix">
                                        <li class="post-meta post-view"><a href="#"><span><i class="icon-post"></i>172</span></a></li>
                                        <li class="post-meta post-comm"><a href="#"><span><i class="icon-post"></i>34</span></a></li>
                                        <li class="post-meta post-date"><a href="#"><span><i class="icon-post"></i>14 Jan 2013</span></a></li>
                                        <li class="post-meta post-read"><a href="#"><i class="icon-post"></i><span>Read More</span></a></li>
                                    </ul>
								</div>
							</div>
						</div>
						<!--/post item-->

						<!-- post item-->
						<div class="post-item style3 boxed">
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img3.jpg" alt=""></div>
                            <div class="inner clearfix">
                                <div class="post-meta-bot post-meta-links">
                                    <div class="post-meta post-date"><span><strong>26</strong><em>April 2013</em></span></div>
                                    <div class="post-meta post-comm"><a href="#" title="34"><span><i class="icon-post"></i></span></a></div>
                                    <div class="post-meta post-view"><a href="#" title="172"><span><i class="icon-post"></i></span></a></div>
                                </div>
                                <div class="post-title"><h2><a href="#">Improve Mobile Support With Server-Side-Enhanced RWD</a></h2></div>
								<div class="post-meta-top"></div>
								<div class="post-desc">
									<p>Wisi denique pri ut, ex detraxit torquatos usu. Per admodum concludaturque te, putant melius aliquam pri in. Id sit case consul contentiones, sea illud postea praesent et. Vix te labore indoctum iudicabit. Ne aliquid facilisis mel. Ut nam duis recteque, nemore everti mel id, no vidit constituto ius.</p>
								</div>
							</div>
						</div>
						<!--/post item-->

						<!-- post item-->
						<div class="post-item boxed style4 clearfix">
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img4.jpg" alt=""></div>
                            <div class="inner">
                                <div class="post-title"><h2><a href="#">Create a WordPress Demo: An Easy Way To Present Adobe Fireworks Design Prototypes</a></h2></div>
                                <div class="post-meta-top">
                                    <a href="#"><span class="post-view"><i class="icon-post2 icon-view"></i>172</span></a>
                                    <a href="#"><span class="post-comm"><i class="icon-post2 icon-comm"></i>34</span></a>
                                    <span class="post-date"><i class="icon-post2 icon-author"></i>14 Jan 2013</span>
                                </div>
                                <div class="post-desc">
									<p>Wisi denique pri ut, ex detraxit torquatos usu. Per admodum concludaturque te, putant melius aliquam pri in. Id sit case consul contentiones, sea illud postea praesent et. Vix te labore indoctum iudicabit. Ne aliquid facilisis mel. Ut nam duis recteque, nemore everti mel id, no vidit constituto ius. Id ullum regione fabulas nam, per ad dicant ridens nostrum.</p>
								</div>
								<div class="post-meta-bot post-meta-links">
                                    <span class="post-author">written by John Doe</span>
									<a href="#" class="btn btn-small btn-lime"><span>Read more</span></a>
								</div>
							</div>
						</div>
						<!--/post item-->

                        <!-- post item-->
                        <div class="post-item boxed style5 clearfix">
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img5.jpg" alt=""></div>
                            <div class="inner">
                                <div class="post-title"><h2><a href="#">How To Create A Tab Widget In WordPress</a></h2></div>
                                <div class="post-meta-top">
                                    <span class="post-author">by John Doe</span>
                                    <span> | </span>
                                    <span class="post-date">5 May 2013</span>
                                </div>
                                <div class="post-desc">
                                    <p>Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will wisi denique pri ut, ex detraxit torquatos usu. Per admodum concludaturque te, putant melius aliquam pri in. Id sit case consul contentiones, sea illud postea praesent et. Vix te labore indoctum iudicabit. Ne aliquid facilisis mel. Ut nam duis recteque, nemore everti mel id, no vidit constituto ius. Id ullum regione fabulas nam, per ad dicant ridens nostrum.</p>
                                </div>
                                <div class="post-meta-bot post-meta-links">
                                    <a href="#" class="btn btn-small btn-pink"><span>Read more</span></a>
                                    <a href="#" class="btn btn-small btn-blue"><span>34 Comments</span></a>
                                </div>
                            </div>
                        </div>
                        <!--/post item-->

						<!-- post item quote -->
						<div class="post-item post-quote boxed">
                            <span class="post-label"></span>
                            <div class="inner">
								<div class="post-title"><h2><a href="#">I don't measure a man's success by how high he climbs but how high he bounces when he hits bottom.</a></h2></div>
								<div class="post-meta-top">
									<span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
									<span class="post-author"><i class="icon-post2 icon-author"></i>George S. Patton</span>
								</div>
								<div class="post-meta-bot post-meta-links"></div>
							</div>
						</div>
						<!--/post item quote -->

						<!-- post item images -->
						<div class="post-item post-img boxed">
                            <span class="post-label label-image"></span>
                            <div class="inner">
								<div class="post-title"><h2><a href="#">I don't know the key to success, but the key to failure is trying to please everybody.</a></h2></div>
								<div class="post-meta-top">
                                    <span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
                                    <span class="post-author"><i class="icon-post2 icon-author"></i>Bill Cosby</span>
								</div>
								<div class="post-meta-bot">
									<div class="post-carousel">
										<div id="myCarousel" class="carousel slide" data-interval="20000">
											<!-- Carousel items -->
											<div class="carousel-inner">
												<div class="active item"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img6.jpg" alt="" /><div class="carousel-desc"><span>Wild Deer</span></div></div>
												<div class="item"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img1.jpg" alt="" /><div class="carousel-desc"><span>Change your fate</span></div></div>
												<div class="item"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img3.jpg" alt="" /><div class="carousel-desc"><span>Unstoppable hero</span></div></div>
												<div class="item"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img2.jpg" alt="" /><div class="carousel-desc"><span>Change your fate</span></div></div>
												<div class="item"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img4.jpg" alt="" /><div class="carousel-desc"><span>Unstoppable hero</span></div></div>
											</div>
											<!-- Carousel indicators -->
											<ol class="carousel-indicators">
												<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
												<li data-target="#myCarousel" data-slide-to="1"></li>
												<li data-target="#myCarousel" data-slide-to="2"></li>
												<li data-target="#myCarousel" data-slide-to="3"></li>
												<li data-target="#myCarousel" data-slide-to="4"></li>
											</ol>
											<!-- Carousel nav -->
											<a class="carousel-control left" href="#myCarousel" data-slide="prev"></a>
											<a class="carousel-control right" href="#myCarousel" data-slide="next"></a>
										</div>
									</div>
								</div>
							</div>
						</div>
						<!--/post item images -->

						<!-- post item video -->
						<div class="post-item post-video boxed">
                            <span class="post-label label-video"></span>
                            <div class="inner">
								<div class="post-image">
									<video id="my_video_1" class="video-js" controls loop
									       preload="auto" poster="images/temp/vjs_poster.png"
									       data-setup="{}">
										<source src="http://test.themefuse.com/artiom/galapagos.mp4" type='video/mp4'>
									</video>
									<script>
										_V_("my_video_1").ready(function(){
											var myPlayer = this;
											var aspectRatio = 242/511;
											var width = document.getElementById(myPlayer.id).parentElement.offsetWidth;
											myPlayer.width(width).height( width * aspectRatio );

											function resizeVideoJS(){
												var width = document.getElementById(myPlayer.id).parentElement.offsetWidth;
												myPlayer.width(width).height( width * aspectRatio );
											}
											resizeVideoJS();
											window.onresize = resizeVideoJS;
										});
									</script>
								</div>
								<div class="post-title"><h2><a href="#">I don't know the key to success, but the key to failure is trying to please everybody.</a></h2></div>
								<div class="post-meta-top">
                                    <span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
                                    <span class="post-author"><i class="icon-post2 icon-author"></i>Bill Cosby</span>
								</div>
							</div>
						</div>
						<!--/post item video -->

						<!-- post item audio -->
						<div class="post-item post-audio boxed">
                            <span class="post-label label-audio"></span>
                            <div class="inner">
								<div class="post-title"><h2><a href="#">Nulla At Nulla Justo, Eget Luctus Tortor</a></h2></div>
								<div class="post-meta-top">
                                    <span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
                                    <span class="post-author"><i class="icon-post2 icon-author"></i>Bill Cosby</span>
								</div>
								<div class="post-image"></div>
								<div class="post-meta-bot">
									<!-- jplayer-->
                                    <div id="jquery_jplayer_1" class="jp-jplayer"></div>
                                    <div id="jp_container_1" class="jp-audio">
                                        <div class="inner">
                                            <div class="jp-gui jp-interface">
                                                <div class="jp-controls-wrap">
                                                    <div class="song_title"></div>
                                                    <div class="jp-current-time"></div>
                                                    <div class="jp-duration"></div>
                                                    <div class="jp-progress">
                                                        <div class="jp-seek-bar">
                                                            <div class="jp-play-bar"></div>
                                                        </div>
                                                    </div>
                                                    <ul class="jp-controls clearfix">
                                                        <li><a href="javascript:;" class="jp-mute" tabindex="1" title="mute">mute</a></li>
                                                        <li><a href="javascript:;" class="jp-unmute" tabindex="1" title="unmute">unmute</a></li>
                                                        <li><a href="javascript:;" class="jp-previous disabled" tabindex="1">previous</a></li>
                                                        <li><a href="javascript:;" class="jp-play" tabindex="1">play</a></li>
                                                        <li><a href="javascript:;" class="jp-pause" tabindex="1">pause</a></li>
                                                        <li><a href="javascript:;" class="jp-next" tabindex="1">next</a></li>
                                                        <li><a href="javascript:;" class="jp-stop" tabindex="1">stop</a></li>
                                                        <li><a href="javascript:;" class="jp-repeat" tabindex="1" title="repeat">repeat</a></li>
                                                        <li><a href="javascript:;" class="jp-repeat-off" tabindex="1" title="repeat off">repeat off</a></li>
                                                        <li><a href="javascript:;" class="jp-volume-max" tabindex="1" title="max volume">max volume</a></li>
                                                        <li><a href="javascript:;" class="jp-shuffle" tabindex="1" title="shuffle">shuffle</a></li>
                                                        <li><a href="javascript:;" class="jp-shuffle-off" tabindex="1" title="shuffle off">shuffle off</a></li>
                                                        <li><a href="javascript:;" class="jp-playlist-toggle" tabindex="1" title="Toggle PlayList">Toggle PlayList</a></li>
                                                    </ul>
                                                    <div class="jp-volume-bar">
                                                        <div class="jp-volume-bar-value"></div>
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="jp-playlist">
                                                <ul class="jp-playlist-inner">
                                                    <li></li>
                                                </ul>
                                            </div>
                                            <div class="jp-no-solution">
                                                <span>Update Required</span>
                                                <a href="http://get.adobe.com/flashplayer/" target="_blank">Flash plugin</a>.
                                            </div>
                                        </div>
                                    </div>
									<!--/ jplayer-->
								</div>
							</div>
						</div>
						<!--/post item audio -->

					</div>
					<!--/ postlist-->
				</div>
				<!--/ content-->
		    </div>

			<div class="col-sm-4">
				<!-- sidebar-->
				<div class="sidebar">

					<!-- widget categories -->
					<div class="widget-container widget_categories boxed">
                        <h3 class="widget-title">Blog Categories</h3>
                        <div class="inner">
							<ul id="categories">
								<li><a href="#"><i class="ico-cat ico-cat1"></i><span>Web design</span></a></li>
								<li class="current-menu-item"><a href="#"><i class="ico-cat ico-cat2"></i><span>Illustration</span></a></li>
								<li><a href="#"><i class="ico-cat ico-cat3"></i><span>Coding & Development</span></a></li>
								<li><a href="#"><i class="ico-cat ico-cat4"></i><span>Promotions</span></a></li>
							</ul>
						</div>
					</div>
					<!--/widget categories-->

                    <!-- widget flickr-->
                    <div class="widget-container flickr boxed clearfix">
                        <h3 class="widget-title">Flickr feed</h3>
                        <div class="inner">
                            <div class="flickr-inner">
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr1.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr2.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr3.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr4.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr5.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr6.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr7.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr8.png" alt="" /></a></div>
                                <div class="flickr_badge_image"><a href="#"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/flickr9.png" alt="" /></a></div>
                            </div>
                        </div>
                    </div>
                    <!--/ widget flickr-->

					<!-- latest stories -->
					<div class="widget-container widget_recent_entries boxed">
                        <h3 class="widget-title">Latest Stories</h3>
                        <div class="inner">
							<ul>
								<li class="clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest1.png" alt="" /></a>
									<a href="#" class="post-title">UP fan takes to the skies in a house by tying hundreds of balloons to it</a>
								</li>
								<li class="clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest2.png" alt="" /></a>
									<a href="#" class="post-title">Working in paradise is just murder! Ben Miller is on the case in</a>
								</li>
								<li class="clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest3.png" alt="" /></a>
									<a href="#" class="post-title">Mancini red rage! Kompany facing ban for 'nothing' fumes City</a>
								</li>
								<li class="clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest4.png" alt="" /></a>
									<a href="#" class="post-title">Adebayor set for Africa Cup of Nations as Togo chief overrules decision</a>
								</li>
							</ul>
						</div>
					</div>
					<!--/latest stories -->

					<!-- latest comments-->
					<div class="widget-container widget_recent_comments boxed">
                        <h3 class="widget-title">Latest Comments</h3>
                        <div class="inner">
							<ul id="recentcomments">
								<li class="recentcomments clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest5.png" alt="" /></a>
									<span class="recent_comment"><a href="#" rel="external nofollow">Jonatan Doe: </a>UP fan takes to the skies in a house by tying hundreds balloons</span>
								</li>
								<li class="recentcomments clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest6.png" alt="" /></a>
									<span class="recent_comment"><a href="#" rel="external nofollow">DimiB: </a>Working in paradise is just murder! Ben Miller is on the case</span>
								</li>
								<li class="recentcomments clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest7.png" alt="" /></a>
									<span class="recent_comment"><a href="#" rel="external nofollow">Alex Luncasu: </a>Mancini red rage! Kompany facing ban for 'nothing' fumes City</span>
								</li>
								<li class="recentcomments clearfix">
									<a href="#" class="widget-thumb"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/latest8.png" alt="" /></a>
									<span class="recent_comment"><a href="#" rel="external nofollow">BogdanC: </a>Adebayor set for Africa Cup of Nations as Togo chief overrules</span>
								</li>
							</ul>
						</div>
					</div>
					<!-- latest comments-->

                    <!-- widget text-->
                    <div class="widget-container widget_text boxed">
                        <h3 class="widget-title">Text widget</h3>
                        <div class="inner">
                            <div class="textwidget">
                                <p>Wisi denique pri ut, ex detraxit torq uatos usu. Per admodum concl udat urque te, putant melius aliquam pri in. Id sit case consul conte ntiones, sea illud postea praesent et. Vix te labore indoctum iudicabit.</p>
                            </div>
                        </div>
                    </div>
                    <!-- /widget text-->

					<!-- widget tags-->
					<div class="widget-container widget_tag_cloud boxed">
                        <h3 class="widget-title">Tags</h3>
                        <div class="inner">
							<div class="tagcloud">
								<a href="#" class="tag-link-1" title="2 topics"><span>Design</span></a>
								<a href="#" class="tag-link-2" title="3 topics"><span>Illustration</span></a>
								<a href="#" class="tag-link-3" title="5 topics"><span>Interface</span></a>
								<a href="#" class="tag-link-4" title="8 topics"><span>Typography</span></a>
								<a href="#" class="tag-link-5" title="9 topics"><span>Art</span></a>
								<a href="#" class="tag-link-6" title="3 topics"><span>High resolution</span></a>
							</div>
						</div>
					</div>
					<!--/ widget tags-->

					<!-- widget calendar-->
					<div class="widget-container widget_calendar boxed">
						<div class="inner">
							<input type="text" name="date_departure" class="inputField" value="" id="date_departure">
							<script>
								// <![CDATA[
								jQuery(document).ready(function($) {
									var daysRange = 5;

									function assignCalendar(id){
										$('<div class="calendar" />')
												.insertAfter( $(id) )
												.multiDatesPicker({
													dateFormat: 'yy-mm-dd',
													minDate: new Date(),
													maxDate: '+1y',
													altField: id,
													firstDay: 1,
													showOtherMonths: true
												}).prev().hide();
									}

									assignCalendar('#date_departure');
								});
								// ]]>
							</script>
						</div>
					</div>
					<!--/ widget calendar-->

				</div>
				<!--/ sidebar-->
		    </div>
		</div>
		<!--/ row-->

		<!-- row-->
	    <div class="row">
		    <!-- content -->
		    <div class="content clearfix">

			    <!-- post list -->
			    <div class="postlist">

                    <div class="col-sm-4">
		                <!-- post item wide -->
		                <div class="post-item-wide boxed">
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img7.jpg" alt="" /></div>
                            <div class="inner">
				                <div class="post_title">
					                <h2><a href="#">Nulla At Nulla Justo, Eget Luctus Tortor. Nulla Facilisi. Duis</a></h2>
				                </div>
                                <div class="post-meta-top">
                                    <span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
                                    <span class="post-author"><i class="icon-post2 icon-author"></i>Bruce Lee</span>
                                </div>
				                <div class="post-descr">
					                <p>Etiam at risus et justo dignissim congue. Donec congue lacinia dui, a porttitor lectus condimentum laoreet. Nunc eu ullamcorper orci. Quisque eget odio ac lectus ibulum faucibus eget in metus. In entesque faucibus vestibulum. Nulla at nulla justo, eget luctus tortor. Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor, lacus lacus</p>
				                </div>
				                <div class="post-meta-bot post-meta-links">
                                    <a href="#" class="btn btn-small btn-pink"><span>Read more</span></a>
                                    <a href="#" class="btn btn-small btn-blue"><span>34 Comments</span></a>
				                </div>
			                </div>
                        </div>
		                <!--/ post item wide -->
                    </div>

				    <div class="col-sm-4">
					    <!-- post item wide -->
					    <div class="post-item-wide boxed">
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img8.jpg" alt="" /></div>
                            <div class="inner">
							    <div class="post_title">
								    <h2><a href="#">Nulla Facilisi. Duis Aliquet Egestas Purus In Blandit. Curabitur</a></h2>
							    </div>
                                <div class="post-meta-top">
                                    <span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
                                    <span class="post-author"><i class="icon-post2 icon-author"></i>Henry Ford</span>
                                </div>
							    <div class="post-descr">
								    <p>Vivamus hendrerit arcu sed erat molestie vehicula. Sed auctor neque eu tellus rhoncus ut eleifend nibh porttitor. Ut in nulla enim. Phasellus molestie magna non est bibendum non venenatis nisl tempor. Suspendisse dictum feugiat nisl ut dapibus. Mauris iaculis porttitor posuere. Praesent id metus massa, ut blandit odio. Proin quis tortor orci. Etiam at risus et justo dignissim</p>
							    </div>
							    <div class="post-meta-bot post-meta-links">
                                    <a href="#" class="btn btn-small btn-pink"><span>Read more</span></a>
                                    <a href="#" class="btn btn-small btn-blue"><span>34 Comments</span></a>
							    </div>
							</div>
					    </div>
					    <!--/ post item wide -->
				    </div>

				    <div class="col-sm-4">
					    <!-- post item wide -->
					    <div class="post-item-wide boxed">
                            <div class="post-image"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/post_img9.jpg" alt="" /></div>
                            <div class="inner">
							    <div class="post_title">
								    <h2><a href="#">Curabitur Vulputate, Ligula Lacinia Scelerisque Tempor</a></h2>
							    </div>
                                <div class="post-meta-top">
                                    <span class="post-date"><i class="icon-post2 icon-date"></i>SEP 5TH, 2013</span>
                                    <span class="post-author"><i class="icon-post2 icon-author"></i>David Frost</span>
                                </div>
							    <div class="post-descr">
								    <p>Nulla facilisi. Duis aliquet egestas purus in blandit. Curabitur vulputate, ligula lacinia scelerisque tempor, lacus lacus ornare ante, ac egestas est urna sit amet arcu. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed molestie augue sit amet leo consequat posuere. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices conubia nostra, per inceptos himenaeos.</p>
							    </div>
							    <div class="post-meta-bot post-meta-links">
                                    <a href="#" class="btn btn-small btn-pink"><span>Read more</span></a>
                                    <a href="#" class="btn btn-small btn-blue"><span>34 Comments</span></a>
							    </div>
						    </div>
					    </div>
					    <!--/ post item wide -->
				    </div>

				</div>
			    <!--/ post list -->
            </div>
		    <!--/ content -->
	    </div>
	    <!--/ row-->

		<!-- row-->
		<div class="row">
			<div class="col-sm-8">
				<!-- content -->
				<div class="content">

					<!-- post comments -->
					<div class="comment-list clearfix" id="comments">
						<h2>4 Comments Added</h2>
						<a href="#addcomments" class="link-add-comment anchor">Join Discussion</a>

						<ol>
							<li class="comment">

								<div class="comment-body boxed">
									<div class="comment-arrow"></div>
									<div class="comment-avatar">
										<div class="avatar"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/avatar1.png" alt="" /></div>
									</div>
									<div class="comment-text">
										<div class="comment-author clearfix">
											<a href="#" class="link-author">John Doe</a> <span class="comment-date">21 JAN 2013</span> | <a href="#addcomments" class="link-reply anchor">Reply</a>
										</div>
										<div class="comment-entry">
                                            Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae abtore veritatis et quasi architecto beatae vitae.
										</div>
									</div>
									<div class="clear"></div>
								</div>

                                <!-- comment reply -->
                                <ul class="children">
                                    <li class="comment">
                                        <div class="comment-body boxed">
                                            <div class="comment-arrow"></div>
                                            <div class="comment-avatar">
                                                <div class="avatar"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/avatar2.png" alt="" /></div>
                                            </div>
                                            <div class="comment-text">
                                                <div class="comment-author clearfix">
                                                    <a href="#" class="link-author">Chris Wootton</a> <span class="comment-date">4 FEB 2013</span> | <a href="#addcomments" class="link-reply anchor">Reply</a>
                                                </div>
                                                <div class="comment-entry">
                                                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae abtore veritatis
                                                </div>
                                            </div>
                                            <div class="clear"></div>
                                        </div>
                                    </li>
                                </ul>
                                <!--/ comment reply -->

                                <!-- comment reply -->
                                <ul class="children">
                                    <li class="comment">
                                        <div class="comment-body boxed">
                                            <div class="comment-arrow"></div>
                                            <div class="comment-avatar">
                                                <div class="avatar"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/avatar1.png" alt="" /></div>
                                            </div>
                                            <div class="comment-text">
                                                <div class="comment-author clearfix">
                                                    <a href="#" class="link-author">John Doe</a> <span class="comment-date">4 FEB 2013</span> | <a href="#addcomments" class="link-reply anchor">Reply</a>
                                                </div>
                                                <div class="comment-entry">
                                                    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae abtore veritatis
                                                </div>
                                            </div>
                                            <div class="clear"></div>
                                        </div>
                                    </li>
                                </ul>
                                <!--/ comment reply -->

							</li>

							<li class="comment">

								<div class="comment-body boxed">
									<div class="comment-arrow"></div>
									<div class="comment-avatar">
										<div class="avatar"><img src="http://pixelkit.com/demo/html/metro-vibes/metro-vibes-css/images/temp/avatar3.png" alt="" /></div>
									</div>
									<div class="comment-text">
										<div class="comment-author clearfix">
											<a href="#" class="link-author">John Doe</a> <span class="comment-date">4 FEB 2013</span> | <a href="#addcomments" class="link-reply anchor">Reply</a>
										</div>
										<div class="comment-entry">
                                            Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae abtore veritatis et quasi architecto beatae vitae.
										</div>
									</div>
									<div class="clear"></div>
								</div>

							</li>

						</ol>
					</div>
					<!--/ post comments -->

					<!-- comment form -->
					<div class="add-comment boxed" id="addcomments">

						<div class="add-comment-title"><h3>Leave a reply</h3></div>

						<div class="comment-form">
							<form action="#" method="post" id="commentForm" class="ajax_form">
								<div class="form-inner">
									<div class="field_text">
										<label for="name" class="label_title">Name</label>
										<input type="text" name="name" id="name" value="" class="inputtext input_middle required no-radius" />
									</div>
									<div class="field_text omega">
										<label for="email" class="label_title">Email</label>
										<input type="text" name="email" id="email" value="" class="inputtext input_middle required no-radius" />
									</div>
									<div class="clear"></div>
									<div class="field_text field_textarea">
										<label for="message" class="label_title">Message</label>
										<textarea cols="30" rows="10" name="message" id="message" class="textarea textarea_middle required no-radius"></textarea>
									</div>
									<div class="clear"></div>
								</div>

								<div class="rowSubmit">
									<span class="btn btn-red link-submit"><input type="submit" id="send" value="Send Mail" /></span>
                                    <a onclick="document.getElementById('commentForm').reset();return false" href="#" class="link-reset"><span>Reset all fields</span></a>
								</div>
							</form>
						</div>
					</div>
					<!--/ comment form -->

					<!-- tf pagination -->
                    <div class="tf_pagination">
                        <div class="inner">
                            <a class="page_prev" href="#"><span></span></a>

                            <span class="page-numbers page_current">1</span>
                            <a href="#" class="page-numbers">2</a>
                            <a href="#" class="page-numbers">3</a>
                            <a href="#" class="page-numbers">4</a>

                            <a class="page_next" href="#"><span></span></a>
                        </div>
                    </div>
					<!--/ tf pagination -->

					<div class="buttons">
                        <a href="#" class="btn"><span>Load more stories</span></a>
					</div>

                    <div class="buttons">
                        <a href="#" class="btn btn-left"><span>Newer</span></a>
                        <a href="#" class="btn btn-right"><span>Older</span></a>
                    </div>

				</div>
				<!--/ content -->
			</div>
		</div>
		<!--/ row-->

	</div>
	<!--/ container-->
</body>
</html>